/* eslint-disable vue/no-side-effects-in-computed-properties */
<template>
  <div>
    <mu-sub-header>待办列表</mu-sub-header>
    <mu-list
      textline="two-line"
      v-for="(dataSource,index) in dataSources"
      :key="index"
      class="list"
    >
      <mu-list-item avatar button :ripple="true" @click="detail(index)">
        <mu-list-item-action>
          <mu-avatar color="blue">
            <mu-icon value="insert_chart"></mu-icon>
          </mu-avatar>
        </mu-list-item-action>
        <mu-list-item-content>
          <mu-list-item-title>{{dataSource.placeName}}</mu-list-item-title>
          <mu-list-item-sub-title>{{dataSource.areaInfo.county}}</mu-list-item-sub-title>
          <mu-list-item-sub-title>{{dataSource.createString}}</mu-list-item-sub-title>
        </mu-list-item-content>
        <mu-list-item-action>
          <mu-list-item-after-text>{{dataSource.declareStatusName}}</mu-list-item-after-text>
          <mu-button icon>
            <mu-icon value="info"></mu-icon>
          </mu-button>
        </mu-list-item-action>
      </mu-list-item>
      <mu-divider></mu-divider>
    </mu-list>
  </div>
</template>

<script>
/**
 * {"message":"success"
 * ,"body":[{"area":"1200","declareStatusName":"办理中","createString":"2020-03-05 17:00:49","userName":null,"userId":"5e609eb75764982e3e1be23f","buildingId":"5e60bfc15764982e3e1be240","updateString":"2020-03-05 17:00:49","areaInfo":{"countyCode":"510801000000","county":"市辖区"},"declareStatus":"handle","buildingName":"万达广场","contactsTel":"13991191199","id":"5e60bfc15764982e3e1be241","addr":"广元市利州区万源","placeName":"万东歌城","contacts":"杨长勇","usageType":"KTV"}]
 * ,"status":200}
 */
import { declareDetail } from "../utils/api";
export default {
  name: "ListDeclare",
  props: {
    dataSources: {}
  },

  methods: {
    detail: function(index) {
      const {id,buildingId }=this.dataSources[index]
      console.log(id);
      console.log(buildingId);
      
      declareDetail(
        "/declareDetail",
        id
      ).then(resp => {
        this.$store.dispatch("setDeclare", resp.data.body);
      });
      this.$router.push({
        name: "DetailView",
        params: {
          data: this.$store.state.declareDetail
        }
      });
    }
  }

  // created: function() {
  //   this.dataSources = this.$store.state.dataSource;
  // }
};
</script>

<style>
body {
  background-color: #eeeeee;
}
</style>